<template>
    <div class="wrapper">
        <el-row class="container" :gutter="20">
            <!-- 幻灯片 -->
            <el-col :span="12">
                <el-carousel height="290px" class="swiper">
                    <el-carousel-item v-for="item in this.swiperList" :key="item.id" class="swiper-item">
                        <img :src="item.url">
                    </el-carousel-item>
                </el-carousel>
            </el-col>
            <!-- 热帖 -->
            <el-col :span="12">
                <el-table :data="newest">
                    <el-table-column prop="title" label="最新帖子">
                        <template slot-scope="scope">
                            <router-link :to="'/detail?id='+scope.row.postID+'&sectionName='+scope.row.sectionName">【{{scope.row.sectionName}}】{{scope.row.title}}</router-link>
                        </template>
                    </el-table-column>
                    <!-- <el-table-column prop="sectionName" label="来自版块"></el-table-column> -->
                </el-table>
            </el-col>
        </el-row>
    </div>
</template>

<script>
export default {
    name:"Hot",
    props:['swiperList','newest'],
    // data(){
    //     return{
    //         swiperList:this.swiperList
    //     }
    // }
}
</script>

<style lang="scss" scoped>
.wrapper{
    padding: 20px;
    padding-top: 0px;
}
.container{
    // margin:20px;
    height: 290px;
}
.swiper,.swiper-item{
    height: 290px;
    img{
        width: 100%;
        height: 100%;
    }
}
</style>